<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:fragment="head">
    <meta charset="utf-8">
    <title>点滴日记</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width">
    <link rel="stylesheet" th:href="@{css/bootstrap.min.css}">
    <link rel="stylesheet" th:href="@{css/font-awesome/css/font-awesome.min.css}">
    <link rel="stylesheet" th:href="@{css/style.css}" id="theme-styles">
    <script src="js/jquery.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/modernizr.js"></script>

    <style type="text/css">
        body{
            font-family:'楷体';
        }
        a:hover{
            color: red;
        }
        #daohang  a:hover{
            color: red;
        }
    </style>
    
</head>
<body>
    <header th:fragment="header">
        <div class="widewrapper masthead">
            <div class="container">
                <a href="index.html" id="logo">
                    <img src="img/logo.png" alt="clean Blog">
                </a>

                <div id="mobile-nav-toggle" class="pull-right">
                    <a href="#" data-toggle="collapse" data-target=".clean-nav .navbar-collapse">
                        <i class="fa fa-bars"></i>
                    </a>
                </div>

                <nav class="pull-right clean-nav">
                    <div class="collapse navbar-collapse">
                        <ul class="nav nav-pills navbar-nav " id="daohang">                          
                            <li>
                                <a href="index.html">日記</a>
                            </li>
                            <li>
                                <a href="about.html">个人档案</a>
                            </li>
                            <li>
                                <a href="contact.html">给我留言</a>
                            </li>                        
                        </ul>
                    </div>
                </nav>        

            </div>
        </div>

        <div class="widewrapper subheader">
            <div class="container">
                <div class="clean-breadcrumb">
                   <a href="#"><strong style="color: #A97D59;font-size: 24px; padding: 0pc 1pc 0pc 0pc;">最美宣言:</strong>身体和灵魂，至少有一个在前行的路上。</a>
                </div>

                <div class="clean-searchbox">
                    <form action="#" method="get" accept-charset="utf-8">
                        <input class="searchfield" id="searchbox" type="text" placeholder="搜索标题">
                        <button class="searchbutton" type="submit">
                            <i class="fa fa-search"></i>
                        </button>
                    </form>
                </div>
            </div>
        </div>
    </header>

   
    <footer th:fragment="footer">
        <div class="widewrapper footer">
            <div class="container">
                <div class="row">
                    <div class="col-md-5 footer-widget">
                        <h3> <i class="fa fa-user"></i>日记介绍</h3>

                       <p>就像是一只灰机，灰到无法呼吸。还花呗，还借呗，还房贷，还车贷，唉呀妈呀脑瓜藤，唉呀妈呀脑瓜藤。</p>
                       <p>就像是一堆只灰机，灰到无法呼吸。还花呗，还借呗，还房贷，还车贷，唉呀妈呀脑瓜藤，唉呀妈呀脑瓜藤。</p>
                       <p>就像是漫天灰机，灰到无法呼吸。还花呗，还借呗，还房贷，还车贷，唉呀妈呀脑瓜藤，唉呀妈呀脑瓜藤。</p>
                    </div>

                    <div class="col-md-4 footer-widget">
                        <h3> <i class="fa fa-pencil"></i> 债主链接</h3>
                        <ul class="clean-list">
                            <li><a href="">隔壁饺子铺</a></li>
                            <li><a href="">楼下拉面馆</a></li>
                            <li><a href="">对面黄焖鸡</a></li>
                            <li><a href="">楼上咖啡厅</a></li>
                            <li><a href="">顶楼网吧</a></li>
                            <li><a href="">地下室台球厅</a></li>
                        </ul>
                    </div>

                    <div class="col-md-3 footer-widget">
                        <h3> <i class="fa fa-envelope"></i>给我赞助</h3>                        
                        <p>据说现在全国通缉本人还钱，已经被追查好几年了。哎，我太难了。</p>
                         <div class="footer-widget-icon">
                            <img src="img/zfb_pay.png" style="height:8pc;float:left;"> <img src="img/wx_pay.jpg" style="padding-left:3px;height:8pc;float:left;">
                            <br><br>
                            <p>自愿扫码，友情赞助!!!</p>
                        </div>
                    </div>
                   
                </div>
            </div>
        </div>
        <div class="widewrapper copyright">
        	
            &copy; 2020  <a href="index.html" target="_blank">jargles.com</a>  版权所有    
            <a href="http://www.beian.miit.gov.cn/" target="_blank">豫ICP备19034030号</a>
             
        	<p> 
	        	<img src="img/beian.png" style="position:relative;top:-2px;" > 
	        	<a href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=41090202000343" target="_blank">
	        	豫公网安备 41090202000343号</a>
        	</p>
        </div>
        
    </footer>
    
   

</body>
</html>